<template>
    <p>这是Home页</p>
    <h1>Js跳转</h1>
    <button @click="pushStr">push-字符串-跳转</button><br>
    <button @click="pushPath">push-path-跳转</button><br>
    <button @click="pushName">push-name-跳转</button><br>
    <button @click="pushNameParams">push-name-跳转-params</button><br>
    <button @click="pushNameQuery">push-path-跳转-query</button><br>
    <button @click="pushDynRouterByName">push-name-动态路由</button><br>
    <button @click="pushDynRouterByPath">push-path-动态路由</button><br>



</template>
<script>
 export default{
    methods:{
        pushStr(){
            this.$router.push('/about')
        },
        pushPath(){
            this.$router.push({path:'/about'})
        },
        pushName(){
            this.$router.push({name:'about'})
        },
        pushNameParams(){
            this.$router.push({name:'about', state:{params:{id:1 , name:'tom'}}})
        },
        pushNameQuery(){
            this.$router.push({name:'about' , query:{uid:1 ,uname:'tom'}})
        },
        pushDynRouterByName(){
            this.$router.push({name:'product',params:{id:100}})
        },
        pushDynRouterByPath(){
            const id=123
            this.$router.push({path:'/product'+'/'+id})
        }


    },
    mounted(){
        console.log("this.$route",this.$route);
        console.log("this.$router",this.$router);
    }
 }
</script>